<template>
  <section>
    <div v-if="hint == ''">
      <h3 class="voteHeadline">{{value.title}}</h3>


      <div class="voteBox" v-for="(item,index) in value.votes" :key="item.id">
        <p class="VBTitle">{{index + 1 +". "+ item.title}}</p>
        <p class="VBIntroduce">{{"介绍："+ item.introduce}}</p>

        <div class="VBSelect" v-if="item.voteType == 1">
          <van-radio-group v-model="result[index].id">
            <van-radio v-for="sonTtem in item.options" :key="sonTtem.id" :name="sonTtem.id">{{sonTtem.code+". "+ sonTtem.content}}</van-radio>
          </van-radio-group>
        </div>

        <div class="VBSelect" v-else>
          <van-checkbox-group v-model="result[index].id" :max="item.maxCount?item.maxCount:0">
            <van-checkbox  v-for="sonTtem in item.options" :key="sonTtem.id" :name="sonTtem.id">{{sonTtem.code+". "+ sonTtem.content}}</van-checkbox>
          </van-checkbox-group>
        </div>



      </div>

      <div v-if="!isShow" class="voteSubmit" @click="submit">投票</div>
      <div v-if="isShow"  style="font-size: 20px; text-align: center; padding: 30px 0">您已经投过票了！</div>
    </div>

    <div class="VHint" v-else>
      <van-empty description="暂无数据">

      </van-empty>
    </div>
  </section>
</template>
<script>
import api from "@/data/api/index.js";
import Vue from 'vue';
import { Checkbox, CheckboxGroup } from 'vant';
import { RadioGroup, Radio } from 'vant';
import { Toast } from 'vant';

Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(Checkbox);
Vue.use(CheckboxGroup);
Vue.use(Toast);
export default {
  data() {
    return {
      urlData: {},
      value: {},
      pitchOnList:[],
      result: [],
      isShow:false,
      hint:""
    };
  },
  mounted() {
    // this.urlData = JSON.parse(this.$route.query.tdata);
    this.getData()
  },
  methods: {
    getData(){

      api.getHWelfare().then(res=>{

        if(res.code == 0){
          api.getHisWelfare(res.data.id).then(re=>{
              if(re.code=='success'){
                this.value = res.data
                this.result = res.data.votes.map(item=>{
                  let data = {}
                  if (item.voteType == 1) {
                    data.id = ""
                  } else {
                    data.id = []
                  }
                  return data
                })
              }else{
                this.isShow=true
              }
          })

        } else {
          this.hint = res.msg
        }
      })
    },
    submit(){
      for(let i = 0; i < this.result.length; i++){
        if(this.result[i].id.length < 1){
          Toast(this.value.votes[i].title+"未选择")
          return
        }
      }
      let data = []
      this.result.forEach(item=>{
        if(item.id.constructor == Array){
          data.push(...item.id)
        } else {
          data.push(item.id)
        }
      })

      api.HWSubmit(this.value.id,{},{ids:data.toString()}).then(res=>{
        if(res.data == "success"){
          Toast("投票成功")
        } else {
          Toast(res.desc)
        }
        this.$router.go(-1)
      })
    }
  },
};
</script>
<style lang="scss" scoped>
.voteHeadline{
  text-align: center;
  font-size: 26px;
  padding:10px 20px;
}
.voteBox{
  padding: 20px;
}
.voteSubmit{
  padding: 10px 20px;
  margin: 10px 20px ;
  text-align: center;
  font-size: 20px;
  border-radius: 25px;
  color: #fff;
  background-color: #9E0F16;
}
.voteBox{
  margin-bottom: 20px;
}
.VBTitle{
  font-size: 20px;
  // font-weight: 700;
  margin-bottom: 10px;
}
.VBIntroduce{
  // padding: 0 20px 0;
  margin-bottom: 15px;
}
.van-checkbox-group{
  .van-checkbox{
    margin-bottom: 10px;
  }
}

.van-radio-group{
  .van-radio{
    margin-bottom: 10px;
  }
}

.VHint{
  padding: 20px;
  text-align: center;
  color: #999;
  font-size: 20px;
}
</style>
